<!DOCTYPE html>
<html lang="en">
<head>
    <title>修改用户</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="css/style.css"/>
    <script type="text/javascript" src="js/calendar.js"></script>
    <link type="text/css" rel="stylesheet" href="css/calendar-blue.css"></link>
    <link rel="stylesheet" href="static/css/toastr.css">

    <script src="static/js/jquery.min.js"></script>
    <script src="static/js/toastr.min.js"></script>
    <script src="static/js/core.util.js"></script>
    <script src="js/url.js"></script>

</head>
<body>
<div id="wrap">
    <div id="top_content">

        <div id="header">
            <div id="rightheader">
                <p>
                    2024年3月 <br/>
                </p>
            </div>

            <div id="topheader">
                <h1 id="title">
                    <a href="#">我爱登陆</a>
                </h1>
            </div>
            <div id="navigation"></div>
        </div>

        <div id="content">
            <p id="whereami">
            </p>
            <h1>
                修改用户
            </h1>
            <p>
                &nbsp;
            </p>

            <form id="form" method="post">
                <table class="form_table">
                    <input type="hidden" name="id" value=""/>
                    <input type="hidden" name="createDate" value=""/>
                    <tr>
                        <td>用户名：</td>
                        <td><input type="text" name="username" value=""></td>
                    </tr>
                    <tr>
                        <td>密码：</td>
                        <td><input type="password" name="pwd" value=""></td>
                    </tr>
                    <tr>
                        <td>确认密码：</td>
                        <td><input type="password" name="pwd1"></td>
                    </tr>
                    <tr>
                        <td>性别：</td>
                        <td>
                            <input type="radio" name="sex" value="男"/>男
                            <input type="radio" name="sex" value="女"/>女
                            <span id="sex_span"></span>
                        </td>
                    </tr>
                    <tr>
                        <td>个人爱好：</td>
                        <td>
                            <input type="checkbox" name="love" value="文学"/>文学
                            <input type="checkbox" name="love" value="影视"/>影视
                            <input type="checkbox" name="love" value="音乐"/>音乐
                            <input type="checkbox" name="love" value="体育"/>体育
                            <input type="hidden" name="love"/><input type="hidden" name="love"/>
                            <!-- 临时解决：当checkbox全不选时候，则该checkbox域的变量为null，不能动态绑定到spring的问题。。。 -->
                        </td>
                    </tr>
                    <tr>
                        <td>出生日期：</td>
                        <td>
                            <input type="text" id="birthday" name="birthday" value=""/>
                        </td>
                    </tr>
                    <tr>
                        <td>地址：</td>
                        <td><input type="text" name="address" value=""/></td>
                    </tr>
                    <tr>
                        <td>邮箱：</td>
                        <td><input type="text" name="email" value=""/></td>
                    </tr>
                    <tr>
                        <td colspan="2">
                            <input type="button" name="update" onclick="updateUser();" value="提交" class="button">
                            <input type="reset" name="reset" value="重置" class="button">
                        </td>
                    </tr>
                </table>
            </form>
        </div>
    </div>

    <div id="footer">
        <div id="footer_bg">whatisJavaWeb@ifly.com</div>
    </div>
</div>
</body>
<script type="text/javascript">

    function getUser() {
        var userlist = sessionStorage.getItem("userList");
        var dbuserId = sessionStorage.getItem("userId");

        var jsonObject = eval(userlist);

        for (i = 0; i < jsonObject.length; i++) {
            var user = jsonObject[i];
            if (user.id == dbuserId) {
                // 把修改的user数据显示到页面中
                $("input[name='username']").val(user.username);
                $("input[name='pwd']").val(user.pwd);

                // 遍历radio
                $("input[name='sex']").each(function () {
                    if ($(this).val() == user.sex) {
                        this.checked = true;
                    }
                });
                $("input[name='birthday']").val(user.birthday);
                $("input[name='address']").val(user.address);
                $("input[name='email']").val(user.email);
                $("input[name='id']").val(user.id);
                $("input[name='createDate']").val(user.createDate);

                var loveArray = user.love;
                $("input[name='love']").each(function () {
                    // 取得当前复选框的value值
                    var value = $(this).val();
                    // 遍历循环数组,判断数组中和每个元素是否和当前复选框的value值相同
                    for (var i = 0; i < loveArray.length; i++) {
                        var s = loveArray[i];
                        if (value == $.trim(s)) {
                            this.checked = true;
                        }
                    }
                });
                console.log(user);

            }
        }
    }

    getUser();

    function updateUser() {

        var formJson = CoreUtil.formJson("form");
        CoreUtil.sendAjax(url + "user/update.action", formJson, function (data) {
            if (data.code == 0) {
                toastr.success(data.msg)
                window.location.href = "list.html";
            } else {
                toastr.error(data.msg);
            }
        });
    }

    Calendar.setup({
        inputField: "birthday",
        ifFormat: "%Y-%m-%d",
        showsTime: true,
        timeFormat: "24"
    });

</script>
</html>
